<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <title>优房数据房产报告（付费版）</title>
    <link rel="icon" type="text/css" th:href="@{/img/logoIc.png}"/>
    <!--公共样式-->
    <link th:href="@{/css/base.css}" rel="stylesheet"/>
    <link th:href="@{/css/freePayReport.css}" rel="stylesheet"/>
</head>
<body>

<!--标题-->
<section class="header-box">
    <div class="container">
        <div class="row">
            <img th:src="@{/img/logo.png}" />
            <h3 class="title">优房数据房产报告（付费版）</h3>
        </div>
    </div>
</section>

<!--房产数据-->
<div class="public-header-content houseData-chartBox">
    <div class="container">
        <div class="row">
            <div class="header">
                <i></i>房产数据
            </div>
            <div class="content">

                <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12" id="Commuteindex-chart-box">
                    <div class="inside">
                        <header>本区域通勤指数</header>
                        <div class="chartBox">
                            <div class="chart-div" id="Commuteindex-chart"></div>
                            <h5>暂无数据！</h5>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

<!--同步引入-->
<script type='text/javascript'>
    document.write('<scr'+'ipt src="/js/jquery.min.js"></scr'+'ipt>');
</script>
<script type='text/javascript'>
    document.write('<scr'+'ipt src="/js/echarts.common.min.js"></scr'+'ipt>');
</script>
<!--货币格式化-->
<script type='text/javascript'>
    document.write('<scr'+'ipt src="/js/accounting.min.js"></scr'+'ipt>');
</script>
<!--全局公共方法和配置初始化-->
<script type='text/javascript'>
    document.write('<scr'+'ipt src="/js/freePayReportPublic.js"></scr'+'ipt>');
</script>

<script type="text/javascript" th:inline="javascript">
    // 页面所有资源加载完成后再执行数据配置初始化



            //----------------------------通勤指数——饼图----------------------------
            var CommuteIndexData = [[${CommuteIndex}]];




    if(CommuteIndexData){
        if(CommuteIndexData.bike || CommuteIndexData.car || CommuteIndexData.foot || CommuteIndexData.transit){
            $('#Commuteindex-chart-box').find('h5').hide();
            get_Commuter_index(CommuteIndexData.bike, CommuteIndexData.car, CommuteIndexData.foot, CommuteIndexData.transit);

            /*
            var myChart = echarts.init(document.getElementById('Commuteindex-chart'));
            var option = {
                animation: false,
                tooltip : {
                    trigger: 'item',
                    formatter: "{a} <br/> <span style='display:inline-block;margin-right:5px;border-radius:10px;width:9px;height:9px;background-color:#ffe325'></span> {b}: {c}%"
                },
                legend: {
                    orient: 'vertical',
                    left: '20',
                    top: '20',
                    data: ['骑车', '驾车', '步行', '公交']
                },
                series : [{
                    name: '通勤指数',
                    type: 'pie',
                    x: '0%',
                    radius :  ['16%', '50%'],//圆的内外半径
                    center: ['49%', '60%'],//圆的X,Y轴平移
                    data:[
                        {
                            value: CommuteIndexData.bike,
                            name: '骑车',
                            itemStyle:{//圆形颜色
                                normal:{color:'#00b8ee'}
                            }
                        },
                        {
                            value: CommuteIndexData.car,
                            name: '驾车',
                            itemStyle:{
                                normal:{color:'#fe9e25'}
                            }
                        },
                        {
                            value: CommuteIndexData.foot,
                            name: '步行',
                            itemStyle:{//圆形颜色
                                normal:{color:'#8fc320'}
                            }
                        },
                        {
                            value: CommuteIndexData.transit,
                            name: '公交',
                            itemStyle:{
                                normal:{color:'#d2335b'}
                            }
                        }
                    ],
                    itemStyle: {
                        emphasis: {
                            shadowBlur: 10,
                            shadowOffsetX: 0,
                            shadowColor: 'rgba(0, 0, 0, 0.5)'
                        }
                    },
                    label:{
                        normal:{
                            formatter:'{b}：{c}%'
                        }
                    }
                }]
            };
            myChart.setOption(option);

            **/
        }else{
            $('#Commuteindex-chart-box').find('h5').show();
        }
    }else{
        $('#Commuteindex-chart-box').find('h5').show();
    }



</script>

</body>
</html>